<template>
  <div id="cBulkDensity">
    <div id="cHead">
        <div class="cAll_01">
        <router-link  to="Fund"><img id="cAll_arrows" src="../assets/img/arrows.png" alt=""></router-link>    
            <h3>基金超市</h3>
        </div>
        <div class="cAll_02">
            <img id="cAll_seek" src="../assets/img/搜索.png" alt="">
            <input type="text">
            <img id="cAll_voice" src="../assets/img/213麦克风.png" alt="">
        </div>
        <ul class="cSlide-box" id="cSlide-box">
            <li class="cSlide-item" id="cQuery1">自选</li>
            <li class="cSlide-item" id="cAccounts1">全部</li>
            <li class="cSlide-item" id="cWealth1">股票</li>
            <li class="cSlide-item" id="cDeposit1">混合</li>
            <li class="cSlide-item" id="cLoans1">债券</li>
            <li class="cSlide-item" id="cCredit1">货币</li>
            <li class="cSlide-item" id="cPrivate1">保本</li>
        </ul>
            <div class="cList">
            <div class="cList_left">
                基金名称
            </div>
            <div class="cList_right">
                <p>最新净值</p>
                <p>日跌涨幅</p>
            </div>
        </div>
        <!-- 全部 -->
    <div class="cAll_10" id="cAll22" >
        <div class="cAll_11" id="cAll_11">
           
        </div>
    </div>
    <div class="cAll_12" v-for="(item,index) in pp" :key="index">
        <div class="cData">
            <div class="cData_1">
                <p>{{ item.fundName | mess}}</p>
                <p @click="information(item.fundNo)">{{ item.fundNo }}</p>
            </div>
        </div>
            <span>{{ item.everyPrice }}</span>
            <p>{{ item.yearRate }}</p>
    </div>
    
    <ul class="cButtom">
        <li id="cRise">日跌涨幅</li>
        <li id="cWeek" @click="cweek()">近一周</li>
        <li id="cMonth" @click="cmonth()">近一月</li>
        <li id="cThreeMouth" @click="cthreemonth()">近三月</li>
    </ul>
    </div>
    
    <!-- // -->
    
  </div>
</template>

<script>
// import moment from 'moment';
import {cRendergraph} from "../api/BulkDensity"
export default {
    data(){
        return{
            pp:[],
            
        }
    },
    created(){
        this.day()
        
    },
    
    filters: {
            mess(val) {
                if (val.length <= 4) {
                    return val;
                }
                return val.slice(0, 4)+"...";
            },
        },
        
    methods:{
        

        information(query1){
            this.$router.push({
                name:"funddetails",
                query:{fundNo:query1}
            })
            console.log(query1);
        },
        //今日日期
        getdate() {
		      var date = new Date();

		      var year = date.getFullYear();
		      var month = date.getMonth() + 1;
		      var strDate = date.getDate();
		
		      if (month >= 1 && month <= 9) {
		        	month = "0" + month;
		      }
		      if (strDate >= 0 && strDate <= 9) {
		      	  strDate = "0" + strDate;
		      }
		      var currentdate = year + "-" + month + "-" + strDate;
		      return currentdate;
	    },
        //昨天日期
        beforeDay() {
		      var date = new Date();

		      var year = date.getFullYear();
		      var month = date.getMonth();
		      var strDate = date.getDate()+26;
		
		      if (month >= 1 && month <= 9) {
		        	month = "0" + month;
		      }
		      if (strDate >= 0 && strDate <= 9) {
		      	  strDate = "0" + strDate;
		      }
		      var currentdate = year + "-" + month + "-" + strDate;
		      return currentdate;
	    },
        //前一周日期
        week() {
		      var date = new Date();

		      var year = date.getFullYear();
		      var month = date.getMonth() ;
		      var strDate = date.getDate()+24;
		
		      if (month >= 1 && month <= 9) {
		        	month = "0" + month;
		      }
		      if (strDate >= 0 && strDate <= 9) {
		      	  strDate = "0" + strDate;
		      }
		      var currentdate = year + "-" + month + "-" + strDate;
            //   console.log(query1);
		      return currentdate;
	    },
        //前一月日期
        month(){
            var date = new Date();

		      var year = date.getFullYear();
		      var month = date.getMonth();
		      var strDate = date.getDate();
		
		      if (month >= 1 && month <= 9) {
		        	month = "0" + month;
		      }
		      if (strDate >= 0 && strDate <= 9) {
		      	  strDate = "0" + strDate;
		      }
		      var currentdate = year + "-" + month + "-" + strDate;
		      return currentdate;
        },
        //前三月日期
        threemonth(){
            var date = new Date();

		      var year = date.getFullYear();
		      var month = date.getMonth()-2;
		      var strDate = date.getDate();
		
		      if (month >= 1 && month <= 9) {
		        	month = "0" + month;
		      }
		      if (strDate >= 0 && strDate <= 9) {
		      	  strDate = "0" + strDate;
		      }
		      var currentdate = year + "-" + month + "-" + strDate;
		      return currentdate;
        },




        // 接口
        //日跌涨幅
        day(){
            let ca = {
                startTime: this.beforeDay(),
                endTime: this.getdate(),
            }
            cRendergraph(ca).then((res)=>{
                this.pp = res.data
            })
        },
        //前一周
        cweek(){
            let ca = {
                startTime: this.week(),
                endTime: this.getdate(),
            }
            cRendergraph(ca).then((res)=>{
                this.day = res.data
            })
        },
        //前一月
        cmonth(){
            let ca = {
                startTime: this.month(),
                endTime: this.getdate(),
            }
            cRendergraph(ca).then((res)=>{
                this.week = res.data
            })
        },
        //前三月
        cthreemonth(){
            let ca = {
                startTime: this.threemonth(),
                endTime: this.getdate(),
            }
            cRendergraph(ca).then((res)=>{
                this.month = res.data
            })
        },
    }   
}
</script>

<style scoped src="../assets/css/BulkDensity.css">





</style>